<template>
	<view class="feedback-box">
		<view class="feedback-center" style="background-color: #FFFFFF;">
			<view class="feedback-header flex justify-between align-center">
				<view class="" @click="back">
					<i class="cuIcon-back f36"></i>
				</view>
				<view class="w360">
					<u-tabs :list="list"
							:is-scroll="false"
							gutter="112"
							active-color="#000000"
							inactive-color=""
							:current="current"
							font-size="30"
							@change="change">
					</u-tabs>
				</view>
				<view class="">
				</view>
			</view>
		</view>
		
		
		<view class="center-list">
			
			
			
			<view class="" v-if="current == 0" >
				<view  class="r10 f28 h90 lh90 flex align-center justify-between pl30 pr30 mb27"
					style="background-color: #FFFFFF;color: #999999;" @click="showFeedback = true">
					<view class="">
						{{textLabel ? textLabel : '请选择反馈类型'}}
					</view>
					<view class="" @click="showText">
						<i class="cuIcon-unfold"></i>
					</view>
				</view>
				
				<view class="pt30 pl30 pr30 h480 r10" style="background-color: #FFFFFF;color: #999999;">
					<!-- maxlength="-1" -->
					<u-input v-model="value"  height="200" placeholder="请填写反馈内容..."  type="textarea" />
					<u-upload :action="action" max-count="1" @on-success="successImg" @on-remove="removeImg"></u-upload>
				</view>
				
				
				<view class="flex align-center justify-center" style="margin: 400rpx auto 0;">
					<button type="default" class="cu-btn w500 h80 r40"
						style="color: #FFFFFF; background-color:#CCCCCC ;" 
						@click="submit">提交</button>
				</view>
			</view>
			
			
			
			
			<view v-if="current == 1" class="r10 center-list-info" v-for="(item,index) in fromList" :key="index">
				<view class="f30" style="color: #1A1A1A;font-weight: bold;"  >
					<i class="cuIcon-title"></i>
					<text v-if="item.feedbackType == 1">费用问题</text>
					<text v-if="item.feedbackType == 2">程序问题</text>
					<text v-if="item.feedbackType == 3">其他问题</text>
				</view>
				<view class="lh46 f26" style="color:#666666 ;">
					{{item.feedbackContext}}
				</view>
				<view class="f24 mt34" style="color: #999999;">
					{{item.feedbackDate}}
				</view>
			</view>
		</view>
		
		<u-select v-model="showFeedback" :list="listFrom" @confirm="addText"></u-select>
		<view class="foot_box"></view>
		<!-- 加载提示 -->
		<yy-loading text="加载中.." mask="true" click="true" ref="loading"></yy-loading>
		<!-- 信息提示-->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					name: '意见反馈'
				}, {
					name: '反馈记录'
				}],
				current: 1,
				action: this.UPLOADFILE,
				value: '',
				showFeedback: false,
				listFrom:[{
						value: 1,
						label: '费用问题'
					},
					{
						value: 2,
						label: '程序问题'
					},{
						value: 3,
						label: '其他问题'
					}],
				textLabel:'',
				feedbackId: '',
				subList:[{
					feedbackId: '',
					id: uni.getStorageSync('userInfo').id,
					img: ''
				}],
				fromList: {}
			};
		},
		onShow() {},
		onLoad(e) {
			this.getlist()
		},
		methods: {
			change(index) {
				this.current = index;
				if (index) {
					this.fromList = []
					this.getlist()
				}
			},
			
			async getlist() {
				const res = await this.$u.post('api/user/feedback/meFeedback')
				this.fromList = res.data
				console.log('res==>', this.fromList);
			},
			
			addText(index) {
				this.textLabel = index[0].label
				this.feedbackId = index[0].value
				this.subList[0].feedbackId = this.feedbackId
			},
			
			// 图片上传成功时触发
			successImg(e) {
				this.img = e.data
				this.subList[0].img = this.img
			},
			
			// 移除图片时触发
			removeImg(e) {
				this.img = ''
				this.subList[0].img = ''
			},
			
			async submit() {
				const res = await this.$u.post('api/user/feedback/addUserFeedback',{
					apiUserFeedbackImgList: this.subList,
					feedbackContext: this.value,
					feedbackType: this.feedbackId,
					id: uni.getStorageSync('userInfo').id,
					uid: uni.getStorageSync('userInfo').id,
				})
				if (res.code == 200) {
					this.l.msgg(res.msg)
					this.subList[0].feedbackId = ''
					this.subList[0].id = ''
					this.subList[0].img = ''
				} else {
					this.l.msgg(res.msg)
				}
			},
			
			back() {
				uni.navigateBack({
					delta: 1
				})
			}
		}
	};
</script>

<style lang="scss" scoped>
	page {
		width: 100%;
		height: 100%;
		background-color: #F7F5F7;
	}

	.feedback-box {

		.feedback-center {
			padding: 30rpx 30rpx 0;
		}
		
		.center-list {
			padding: 30rpx;
			
			.center-list-info {
				padding: 40rpx 30rpx;
				margin-bottom: 20rpx;
				background-color: #FFFFFF;
			}
		}
	}
</style>
